
import React, { memo } from 'react'
import cs from 'classnames';
import sty from './sty.module.css';
import PropTypes from 'prop-types';

const SearchList = (props) => {
  const { title, list, handleClick } = props;
  return <div className={cs(sty.searchRes, 'flex')}>
    <div>{title}</div>  <ul>{list.length ? list.map((v) => <li key={v.id}
      onClick={() => handleClick(v)}
    >{v.name}</li>) : ''}</ul>
  </div>
}

SearchList.propTypes = {
  list: PropTypes.array,
  handleClick: PropTypes.func,
  title: PropTypes.string
}
SearchList.defaultProps = {
  title: '',
  handleClick: () => { },
  list: []
}

export default memo(SearchList)